<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册页面</title>
    <!--引入layui的样式-->
    <link rel="stylesheet" href="./res/layui/css/layui.css">
    <style>
        *{
            border-radius: 0 !important;
        }

        .login-panel{
            padding:10px;
            background: #fff;
        }
        .register-title{
            text-align: center;
            font-size: 20px;
            font-weight: bold;
            padding: 20px;
            color: #0d8ddb;
        }
        .nav-li{
            position:relative;
            display:inline-block;
            *display:inline;
            *zoom:1;
            margin-top:0;
            list-style:none;
            vertical-align:middle;
            line-height:60px;

        }
        .nav-li b{
            font-size: 20px;
        }
    </style>
</head>
<body class="layui-bg-gray" >
<!--导航条-->
<ul class="layui-nav layui-bg-green">
    <li class="layui-nav-item">
        <a href="#" class="layui-logo">
            <img src="./res/images/44.png" width="80px" alt="">
        </a>
    </li>
    <li class="nav-li">
        <b>人力资源后台管理系统</b>
    </li>
</ul>
<!--登录/注册框-->
<div class="layui-container register-box "
     style="width: 100%;
     height: 800px;
     background-image: url(./res/images/bg11.jpg);
     background-size: cover;
     background-color: #20d8a7">
    <div class="layui-row" style="padding-top: 10%;">
        <div class="layui-col-md6 layui-col-md-offset3 login-panel"
             style="opacity: 0.8;background-color: rgba(255,255,255,0.5);border: 1px solid #626256">
                <form class="layui-form layui-form-pane">
                    <div class="layui-form-item">
                        <h4 class="register-title">管理员注册</h4>
                    </div>
                    <div class="layui-form-item">
                        <label  class="layui-form-label">
                            <i>用户名</i>
                        </label>
                        <div class="layui-input-block">
                            <input type="text" name="username"
                                   class="layui-input" placeholder="请输入用户名"
                                   required lay-verify="required">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label  class="layui-form-label">
                            <i>密码</i>
                        </label>
                        <div class="layui-input-block">
                            <input type="password" name="password"
                                   class="layui-input" placeholder="请输入密码"
                                   required lay-verify="required" autocomplete="off">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label  class="layui-form-label">
                            <i>注册时间</i>
                        </label>
                        <div class="layui-input-block">
                            <input type="text" id="addtime" name="addtime"
                                   class="layui-input" >
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label  class="layui-form-label">
                            <i>状态信息</i>
                        </label>
                        <div class="layui-input-block">
                            <input type="radio" name="status" value="0" title='正常' checked>
                            <input type="radio" name="status" value="1" title="封禁">
                        </div>
                    </div>
                    <div class="layui-form-item" style="display: flex;justify-content: space-between; align-items: center">
                        <a href="login.html" style="color: #0dc316;font-size: 14px;">已有账号,请登录!</a>
                    </div>
                    <div class="layui-form-item">
                        <button class="layui-btn layui-btn-normal layui-btn-fluid"
                                lay-submit lay-filter="formRegister">注册</button>
                    </div>
                </form>
        </div>
    </div>
    <div style="text-align: center;margin-top: 10px;">&copy;毛氏集团</div>
</div>
<script src="./res/js/config.js"></script>
<script src="./res/layui/layui.js"></script>
<script>
    layui.use(function(){
        var ele = layui.element;
        var form = layui.form;
        var $ = layui.jquery;
        //日期组件
        var laydate = layui.laydate;

        // 渲染  date 只有日期  time只有时间  datetime 日期时间
        laydate.render({
            elem: '#addtime',
            type: 'datetime',
            pattern:'yyyy-MM-dd HH:mm:ss'
        });

        //绑定表单事件 formRegister
        form.on('submit(formRegister)',function(data){
            var field = data.field; // 获取表单字段值
            console.log(field); //form表单中的值
            // 此处可执行 Ajax 等操作 (请求后台接口)
            $.get("http://localhost:8989/admin/register",field,function(resp){
                if(resp.success){
                    //注册成功，跳转到登录页面
                    location.href='login.html';
                }else{
                    //弹出提示错误信息
                    layer.alert(resp.msg,{icon:2})
                }
            })
            return false; // 阻止默认 form 跳转
        })

    })
</script>
</body>
</html>